<template>
	<div>
		<head-top></head-top>
		<div class="boxWrap col-sm-12">
			<div class="details_wrap">
				<div class="col-sm-12">
					<!--删除成功-->
					<div class="alert alert-success alert-dismissable" v-if="deleteSuccess">
						<button type="button" class="close" data-dismiss="alert" aria-hidden="true">
							&times;
						</button>
						删除成功！
					</div>
					<!--删除失败-->
					<div class="alert alert-danger alert-dismissable" v-if="deleteError">
						<button type="button" class="close" data-dismiss="alert" aria-hidden="true">
							&times;
						</button>
						删除失败！请稍后再试...
					</div>
					<div class="col-sm-4 detail_left_btn">
						<span><router-link :to="{name:'buildStep',params: {key:-1,tem:-1,model:this.$route.params.id,path:-2}}">批量分析数据</router-link></span>
						<span><router-link :to="{name:'createTemplate',params: {path:1,id:this.$route.params.id}}">编辑模型源代码</router-link></span>
					</div>
					<div class="col-sm-8 detail_right_info">
						<div class="clearfix data_operation">
							<h3 class="left detail_title">{{modelDetails.title}}</h3>
							<span class="right detail_delete btn" @click="deleteSureData()">删除模型</span>
							<span class="right detail_edit btn" @click="editModel()">编辑模型</span>
							<!--<span class="right detail_buy btn" disabled="disabled">收藏模型</span>-->
						</div>
						<p class="data_by_someone text-left">
							<span>由</span><span>{{modelDetails.creator_name}}</span><span>于</span>
							<span>{{modelDetails.create_time}}</span><span>上传</span>
						</p>
						<p class="detail_des text-left p_words">{{modelDetails.description}}</p>
						<div class="detail_status clearfix">
							<p class="detail_upgrade_account left">分类模型</p>
							<p class="left"><span>{{modelDetails.useCount}}</span>次调用</p>
							<!--<p class="left" v-if="modelShare">模型<span>分享</span></p>-->
						</div>
						<!--价格公式-->
						<table class="table table-striped table-hover table-bordered text-left detail_table">
		                    <tbody id="editable_sample_tbody">
		                    	<tr class="text-center price_formula">
		                    		<td>Base price(100 pts/call)</td>
		                    		<td>+</td>
		                    		<td>premium price</td>
		                    		<td>=</td>
		                    		<td>total cost/per call</td>
		                    	</tr>
		                    </tbody>
		                </table>
		               <!--价格计算--> 
		                <div class="price_calculation">
		                	<p class="price_calculation_title">调用花费</p>
		                	<div class="price_calculation_contant">
		                		<input type="number" name="" id="" value="" placeholder="请输入调用条数" v-model="numOfInput"/>
		                		<button class="btn" @click="multiplication()">计算</button>
		                	</div>
		                	<p class="text-right price_calculation_charge">
		                		<span style="color: #97A8C2;">总计:</span>
		                		<span style="color: #FF901D;">{{total}}</span>
		                	</p>
		                </div>
						<!--历史模型列表-->		
						<table class="table table-striped table-hover table-bordered" id="detail_table" style="margin-top:50px;">  
				            <thead>  
				                <tr>  
				                    <th>任务名</th>  
				                    <th>数据名</th> 
				                    <th>提交时间</th> 
				                    <th>完成时间</th>  
				                    <th>任务状态</th>  
				                </tr>  
				            </thead>  
				            <tbody id="editable_sample_tbody"> 
				            	<!--<tr v-if="data_all_list.length==0">
				                	<td colspan="4">暂时无模型历史列表</td>
				                </tr>-->
				            	<tr @click="toDataDetails(data_item.id)" class="cursor"> 
				                    <td>title</td>  
				                    <td>data_item.description</td>  
				                    <td>data_item.creator</td>  
				                    <td>data_item.create_time</td> 
				                    <td>data_item.status</td> 
				              	</tr> 
				              	
				            </tbody>  
				        </table> 
					</div>
				</div>
			</div>
			
		</div>
		<footerHtml></footerHtml>
	</div>
	
</template>

<script>
	//引入公共模块
	import headTop from '@/components/headTop'
	import allTemplates from '@/components/allTemplates'
	import footerHtml from '@/components/footerHtml'
	//api	
	import {urlModelDetail,urldeleteModel} from '../../api/api'
export default {
    name: 'modelDetails',   
    data(){
    	return {
    		modelDetails:{
    			title:'',
    			description:'',
    			creator:'',
    			create_time:'',
    			price:'',  
    			useCount:''
    		},
    		modelHisTask:{
    			title:'',
    			data_name:'',
    			create_time:'',
    			finish_time:'',
				task_status:''
    		},
    		total:'',
    		numOfInput:'',
    		modelShare:false,
    		deleteSuccess:false,
    		deleteError:false
    		
    		   		
    	}
    },
    components:{
    	headTop,
    	footerHtml
    },   
    mounted(){ 	
		let	sendData={   		
	  		id:this.$route.params.id
   		};
	  	urlModelDetail(sendData).then(response => {
  			if(response.data.code==200){	 				
  				let resData=response.data.data;
	 			this.modelDetails.title=resData.name;
	    		this.modelDetails.create_time=resData.create_time;
	    		this.modelDetails.creator =resData.creator ;
	    		this.modelDetails.description=resData.description;
	    		this.modelDetails.useCount=resData.use_count;	
	    		this.modelDetails.price=resData.price;
  			}else if(response.data.code!=200){ 				
  				this.errorTip='获取数据失败';
  				this.deleteError=true;
  			}				    		
     	}).catch(error => {
     		if(error.response.data.code==401){	
     			localStorage.clear();
        		this.$router.replace('/login');
			}
      }); 
    },
    methods: {    	
		multiplication(){
			this.total=this.numOfInput*5
		}
  	}
}
</script>


<style lang="css">
	@import "../../assets/css/base.css"
</style>
<style lang="css">
	@import "../../assets/css/data_details.css"
</style>